Ext.define('dg.controller.Main', {
    extend: 'Ext.app.Controller',

    /*stores: ['Articles'],

    models: ['Article'],

    views: ['article.Grid', 'article.Preview'],
*/


    refs: [{
        ref: 'treeMenucito',
        selector: 'treemenu'
    },{
		ref:'tabPanelMain',
		selector:'#tabpanelprincipal'
	}],
	
	views: ['TreeMenu'],

    init: function() {
		//console.info("Init de controlador lanzado!");


       /* Ext.Ajax.request({
            url:'index.php/usuario/datospersonales',
            scope: this,
            success: function ( respuesta){
                respuesta= Ext.decode( respuesta.responseText );
                console.info(respuesta.data.nombre);
*/
                Ext.create('Ext.container.Viewport', {
                    layout:'fit',
                    items: {
                        xtype:'panel',
                        layout:'border',
                        tbar:[{
                            text:'Archivo'
                        },{
                            text:'Editar'
                        },"-","->",usuario.nombre," ",{
                            text:'Salir',
                            handler: function (){
                                alert("Muchas gracias por su visita!");
                                Ext.Ajax.request({
                                    url:'j_spring_security_logout',
                                    success: function (){
                                        window.location.reload();
                                    }
                                });
                            }
                        }],
                        items:[{
                            xtype:'treemenu',
                            //store: store,
                            region:'west',
                            layout:'fit',
                            //html:'Menu',
                            width:250,
                            split: true,
                            collapsible: true/*,
                            listeners:{
                                itemclick: function ( view_this, record){
                                    console.info(record.raw.controlador);
                                }
                            }*/
                        },{
                            region:'center',
                            xtype:'tabpanel',
                            id:'tabpanelprincipal',
                            //html:'centro de la aplicacion'
                            items:[{
                                title:'Inicio',
                                iconCls:'blue_home_icon',
                                html:'Hola mundo'
                                /*autoScroll :true,
                                //html:'Dashboard'
                                loader: {
                                    //autoLoad : true,
                                    url: 'index.php/usuario/getdashboard',
                                    loadMask : true,
                                    renderer: 'html',
                                    params: {
                                        userId: 1
                                    },
                                    success: this.drawChart
                                },
                                listeners:{
                                    //scope: this,
                                    afterrender: function (panel){
                                        panel.getLoader().load();
                                    }
                                }*/
                            }]
                        }]
                    }
                });
            /*}
        });


		
		/*this.getTreeMenucito().on('itemclick', function ( view_this, record){
			console.info(record.raw.controlador);
		});*/
		
		this.control({
			treemenu:{
				itemclick: this.agregarModulo
			}
		});
	},
	
	agregarModulo: function ( view_this, record){
			var ctr= this.getController(record.raw.controlador);
			
			var panel= ctr.init();
			
			this.getTabPanelMain().add(panel);
			this.getTabPanelMain().setActiveTab(panel.id);
    },

    drawChart: function (){


        Ext.create('Ext.tip.ToolTip', {
            target: 'cabeceradash',
            width: 200,
            autoLoad: {
                url: 'index.php/usuario/gettooltip'
            },
            anchor: 'top',
            dismissDelay: 15000 // auto hide after 15 seconds
        });


        window.generateData = function(n, floor){
            var data = [],
                p = (Math.random() *  11) + 1,
                i;

            floor = (!floor && floor !== 0)? 20 : floor;

            for (i = 0; i < (n || 12); i++) {
                data.push({
                    name: Ext.Date.monthNames[i % 12],
                    data1: Math.floor(Math.max((Math.random() * 100), floor)),
                    data2: Math.floor(Math.max((Math.random() * 100), floor)),
                    data3: Math.floor(Math.max((Math.random() * 100), floor)),
                    data4: Math.floor(Math.max((Math.random() * 100), floor)),
                    data5: Math.floor(Math.max((Math.random() * 100), floor)),
                    data6: Math.floor(Math.max((Math.random() * 100), floor)),
                    data7: Math.floor(Math.max((Math.random() * 100), floor)),
                    data8: Math.floor(Math.max((Math.random() * 100), floor)),
                    data9: Math.floor(Math.max((Math.random() * 100), floor))
                });
            }
            return data;
        };

         window.store1 = Ext.create('Ext.data.JsonStore', {
            fields: ['name', 'data1', 'data2', 'data3', 'data4', 'data5', 'data6', 'data7', 'data9', 'data9'],
            data: generateData()
        });


        var chart = Ext.create('Ext.chart.Chart', {
                id: 'chartCmp',
                xtype: 'chart',
                width:600,
                height: 800,
                renderTo:'divChart',
                style: 'background:#fff',
                theme: 'Category2',
                insetPadding: 20,
                animate: true,
                store: store1,
                legend: {
                    position: 'right'
                },
                axes: [{
                    type: 'Radial',
                    position: 'radial',
                    label: {
                        display: true
                    }
                }],
                series: [{
                    showInLegend: true,
                    type: 'radar',
                    xField: 'name',
                    yField: 'data1',
                    style: {
                        opacity: 0.4
                    }
                },{
                    showInLegend: true,
                    type: 'radar',
                    xField: 'name',
                    yField: 'data2',
                    style: {
                        opacity: 0.4
                    }
                },{
                    showInLegend: true,
                    type: 'radar',
                    xField: 'name',
                    yField: 'data3',
                    style: {
                        opacity: 0.4
                    }
                }]
            });


    }
});